How to customize the position of gauge indicator in VChart?
Question Description
In the design, there is a gap set between each piece of the ring chart, and there is also a gray background ring under the interval. How can this effect be achieved?
Solution
This effect can be achieved using the common chart of VChart. The common chart can be configured with two pie series, where the first series has only one data to simulate the background ring, and the second series is a regular pie series. Note:
padAngle: Configure the angle of the interval;innerRadius/outerRadius: Configure the inner and outer radius. Both series need to have the same inner and outer radius;- Do not reverse the order of the series between each other, because the series configured later has a higher z-index;
- It is recommended to turn off animation and tooltip interaction for the background series.